<template>
	<div>
		<div class="activitiesbanner" v-if="dataList.length>0">
			<!--一行一列-->
			<div v-if="posadpicStyle==='one'">
				<div v-for="(val,index) in dataList" :key="index">
					<img style="width: 100%;" :src="val.publicityPicture" @click='jumpEvent(val)' />
				</div>
			</div>
			<!--一行两列-->
			<div class="coutwoPic" v-if="posadpicStyle==='two'" >
				<div class="coutwoPicimg" v-for="(val,index) in dataList" :key="index">
					<img :src="val.publicityPicture" @click="jumpEvent(val)" />
				</div>
			</div>
			<!--一行三列-->
			<div class="couthreePic" v-if="posadpicStyle==='three'" >
				<div class="couThreePicimg" v-for="(val,index) in dataList" :key="index">
					<img :src="val.publicityPicture" @click='jumpEvent(val)' />
				</div>
			</div>
			<div style="clear: both;"></div>
		</div>
		<div v-if="dataList.length==0 && env === 'edit'" style="height: 2.5rem;line-height: 2.5rem;">请配置图片数据</div>
	</div>
</template>

<script>
import handlePath from "../../utils/lxn/handlePath"
	export default {
		props: {
			dataList: {
				type: Array,
				default: () => []
			},
			config: {
				type: Object,
				default: () => {}
			},
			part:{
				type:Number,
				default:1
			}
		},
		data() {
			return {

			}
		},
		components: {

		},
		methods: {
			jumpEvent(item) {
				console.log("打印item",item)
				if(item.extendField) {
					// var urldata = JSON.parse(item.extendField).url.path
					let urldata = handlePath(item)
					if(urldata) {
						this.$router.push({
							path:urldata
							// name: "MiddleWare",
							// params: {
							// 	pageName: urldata
							// }
						})
					}

				}
			},
		},
		computed: {
			posadpicStyle() {
				if(this.config.id) {
					if(parseInt(this.getCurrentVDONew(this.config.id,this.part).config.posadpicStyle) == 0) {
						return 'one';
					} else if(parseInt(this.getCurrentVDONew(this.config.id, this.part).config.posadpicStyle) == 1) {
						return 'two';
					} else if(parseInt(this.getCurrentVDONew(this.config.id, this.part).config.posadpicStyle) == 2) {
						return 'three';
					} else {
						return 'one';
					}
				}
			},
			env() {
				return window.environment; // 获取是否是编辑状态
			},
		},
		mounted() {
		},
	}
</script>

<style>
	.activitiesbanner .coutwoPic {
		/*padding: 0.5rem;*/
		position: relative;
		float: left;
		width: 100%;
	}
	
	.activitiesbanner .coutwoPic .coutwoPicimg {
		position: relative;
		float: left;
		width: 50%;
		/*margin: 0.3rem 0rem;*/
	}
	
	.activitiesbanner .coutwoPic .coutwoPicimg img {
		width: 100%;
		/*padding: 0 0.25rem;*/
	}
	
	.activitiesbanner .couthreePic {
		/*padding: 0.5rem 0.2rem;*/
		text-align: center;
		margin: 0rem auto;
		float: left;
	}
	
	.activitiesbanner .couthreePic .couThreePicimg {
		float: left;
		/*margin: 0.3rem 1%;*/
		width: 33.33%;
	}
	
	.activitiesbanner .couthreePic .couThreePicimg img {
		max-width: 100%;
		margin: 0 auto;
	}
</style>